<template>
  <scroll-view
    scroll-y
    style="height: 100vh; text-align: center"
    class="bg-white"
  >
    <view class="title">{{ score_data.title }}</view>
    <view class="title_en">{{ score_data.title_en }}</view>
    <view class="unit" :style="score_data.is_small ? 'width: 90%;' : ''">
      <span v-if="score_data.unit"
        >{{ score_data.show_more ? "男/" : "" }}(单位：{{
          score_data.unit
        }})</span
      >
    </view>
    <image
      class="score_image"
      :lazy-load="true"
      :style="score_data.is_small ? 'width: 90%;' : ''"
      :src="img"
      mode="widthFix"
    ></image>
    <view class="desc" v-if="score_data.desc">{{ score_data.desc }}</view>

    <view class="title" v-if="score_data.show_more">{{
      more_score.title
    }}</view>
    <view class="title_en" v-if="score_data.show_more">{{
      more_score.title_en
    }}</view>
    <view
      class="unit"
      :style="score_data.is_small ? 'width: 90%;' : ''"
      v-if="score_data.show_more"
    >
      <span v-if="score_data.unit">女/(单位：{{ more_score.unit }})</span>
    </view>
    <image
      class="score_image"
      :lazy-load="true"
      v-if="score_data.show_more"
      :style="score_data.is_small ? 'width: 90%;' : ''"
      :src="more_score.img"
      mode="widthFix"
    ></image>
    <view class="text" v-if="show_source"
      >来源：国家体育总局群体司《国民体质测定标准手册（幼儿部分)》</view
    >
    <view class="rule">{{ score_data.rule }}</view>
  </scroll-view>
</template>

<script>
import { qiniuyunUrl } from "@/common/config";
export default {
  data() {
    return {
      i: "",
      score_data: {},
      img: "",

      more_score: {
        title: "体重评分标准(女)",
        title_en: "Weight scoring criteria（girl）",
        unit: "kg",
        img: qiniuyunUrl + "score_17.png",
      },
      scores: [
        {
          title: "身高评分标准",
          title_en: "Height scoring criteria",
          is_small: true,
          unit: "cm",
          img: "score_1.png",
          rule: "5分：优秀 4分：良好 3分：及格 2分：不及格 1分：不及格",
        },
        {
          title: "心率评分标准",
          title_en: "Heart rate scoring criteria",
          unit: "次/分",
          img: "score_24.png",
          rule: "70-120：正常     小于70和大于120：异常",
        },
        {
          title: "肺活量评分标准",
          title_en: "Lung capacity score standard",
          unit: "ml",
          img: "score_14.png",
          rule: "5分：优秀 3分：合格 1分：不合格",
        },
        {
          title: "定位与抓取评分标准",
          title_en: "Positioning and grasping scoring criteria",
          unit: "次",
          img: "score_13.png",
          rule: "5分：优秀 3分：合格 1分：不合格",
        },
        {
          title: "精细动作动作评分标准",
          title_en: "Scoring criteria for fine motor movements",
          unit: "秒",
          img: "score_12.png",
          rule: "5分：优秀 3分：合格 1分：不合格",
        },
        {
          title: "网球掷远评分标准",
          title_en: "Scoring standard of tennis throwing distance",
          is_small: true,
          unit: "米",
          img: "score_11.png",
          rule: "5分：优秀 4分：良好 3分：及格 2分：不及格 1分：不及格",
        },
        {
          title: "10米折返跑评分标准",
          title_en: "Scoring standard of 10 meter turn back",
          is_small: true,
          unit: "秒",
          img: "score_10.png",
          rule: "5分：优秀 4分：良好 3分：及格 2分：不及格 1分：不及格",
        },
        {
          title: "过独木桥评分标准",
          title_en: "Scoring criteria for crossing single wooden bridge",
          is_small: true,
          unit: "秒",
          img: "score_9.png",
          rule: "5分：优秀 4分：良好 3分：及格 2分：不及格 1分：不及格",
        },
        {
          title: "双脚连续跳评分标准",
          title_en: "Scoring standard of two foot continuous jump",
          is_small: true,
          unit: "秒",
          img: "score_8.png",
          rule: "5分：优秀 4分：良好 3分：及格 2分：不及格 1分：不及格",
        },
        {
          title: "坐位体前屈评分标准",
          title_en: "Scoring criteria for sitting forward flexion",
          is_small: true,
          unit: "cm",
          img: "score_7.png",
          rule: "5分：优秀 4分：良好 3分：及格 2分：不及格 1分：不及格",
        },
        {
          title: "立定跳远评分标准",
          title_en: "Standing long jump scoring standard",
          is_small: true,
          unit: "cm",
          img: "score_6.png",
          rule: "5分：优秀 4分：良好 3分：及格 2分：不及格 1分：不及格",
        },
        {
          title: "长短臂评分标准",
          title_en: "Evaluation criteria of long and short arms",
          unit: "",
          img: "score_5.png",
          rule: "5分：正常 3分：轻微 1分：严重",
        },
        {
          title: "高低肩评分标准",
          title_en: "Evaluation criteria of high and low shoulders",
          unit: "",
          img: "score_5.png",
          rule: "5分：正常 3分：轻微 1分：严重",
        },
        {
          title: "“X”型腿评分标准",
          title_en: '"X" leg scoring criteria',
          unit: "cm",
          img: "score_4.png",
          rule: "5分：正常  3分：轻微  1分：严重",
        },
        {
          title: "“O”型腿评分标准",
          title_en: '"O" leg scoring criteria',
          unit: "cm",
          img: "score_3.png",
          rule: "5分：正常  3分：轻微  1分：严重",
        },
        {
          title: "脊柱侧弯评分标准",
          title_en: "Evaluation criteria for scoliosis",
          desc:
            "说明：脊柱侧弯度数反应脊柱侧弯严重程度，度数越小，严重程度越低，得分越高;度数越大，严重程度越高，得分越低。",
          unit: "度/°",
          img: "score_16.png",
          rule: "5分：正常  3分：轻微  1分：严重",
        },
        {
          title: "体重评分标准(男)",
          title_en: "Weight scoring criteria（boy）",
          is_small: true,
          show_more: true,
          unit: "kg",
          img: "score_2.png",
          rule: "5分：优秀  4分：良好  3分：及格  2分：不及格  1分：不及格",
        },
        {
          title: "足弓评分标准",
          title_en: "Arch scoring criteria",
          unit: "",
          img: "score_19.png",
          rule: "5分：正常  3分：轻微",
        },
        {
          title: "营养健康评分标准",
          title_en: "Nutrition and health score standard",
          unit: "分",
          img: "score_18.png",
          rule: "5分：优秀 4分：良好 3分：及格 2分：不及格 1分：不及格",
        },
      ],
    };
  },
  methods: {
    /**
     *  显示
     */
    showScore(option) {
      if (option.name === "身高") {
        this.i = 0;
      } else if (option.name === "体重") {
        this.i = 16;
      } else if (option.name === "营养健康评估") {
        this.i = 18;
      } else if (option.name === "足弓") {
        this.i = 17;
      } else if (option.name === "长短臂") {
        this.i = 11;
      } else if (option.name === "高低肩") {
        this.i = 12;
      } else if (option.name === "脊柱侧弯") {
        this.i = 15;
      } else if (option.name === "O型腿") {
        this.i = 14;
      } else if (option.name === "X型腿") {
        this.i = 13;
      } else if (option.name === "心率") {
        this.i = 1;
      } else if (option.name === "肺活量") {
        this.i = 2;
      } else if (option.name === "定位与抓取") {
        this.i = 3;
      } else if (option.name === "精细动作") {
        this.i = 4;
      } else if (option.name === "网球掷远") {
        this.i = 5;
      } else if (option.name === "10米折返跑") {
        this.i = 6;
      } else if (option.name === "过独木桥") {
        this.i = 7;
      } else if (option.name === "双脚连续跳") {
        this.i = 8;
      } else if (option.name === "坐位体前屈") {
        this.i = 9;
      } else if (option.name === "立定跳远") {
        this.i = 10;
      }
      if (
        this.i == 0 ||
        this.i == 5 ||
        this.i == 6 ||
        this.i == 7 ||
        this.i == 8 ||
        this.i == 9 ||
        this.i == 10 ||
        this.i == 16
      ) {
        this.show_source = true;
      }
      this.score_data = this.scores[this.i];
      this.img = qiniuyunUrl + this.score_data.img;
      //   设置标题
      uni.setNavigationBarTitle({
        title: this.score_data.title,
      });
    },
  },
  onLoad(option) {
    this.showScore(option);
  },
};
</script>

<style scoped lang ='scss' >
.title {
  color: #444;
  font-size: 13px;
  margin: 30px auto 0;
}
.title_en {
  color: #444;
  font-size: 9px;
}
.unit {
  font-size: 9px;
  color: #414141;
  width: 70%;
  margin: auto;
  text-align: left;
  margin-top: 8px;
  margin-bottom: 8px;
  height: 12px;
}
.score_image {
  width: 70%;
}
.desc {
  width: 70%;
  color: #2e2f2f;
  font-size: 9px;
  margin: auto;
  text-align: left;
}
.text {
  color: #2e2f2f;
  font-size: 9px;
  margin-top: 8px;
}
.rule {
  font-size: 10px;
  color: #1a1311;
  font-weight: bold;
  margin-top: 22px;
}
</style>
